// import React, { Component } from 'react'
// export default class Item extends Component {
//   render() {
//     let { courseList } = this.props
//     return (
//       <div className="box">
//         {courseList.map((v) => {
//           return (
//             <div className="item" key={v.id}>
//               <h1>{v.title}</h1>
//               <p>{v.content}</p>
//               <button onClick={() => this.add(v)}>加入购物车</button>
//             </div>
//           )
//         })}
//       </div>
//     )
//   }
//   add = (item) => {
//     this.props.add(item)
//   }
// }

// 函数组件
import React from 'react'

export default function Item(props) {
  const add = (item) => {
    props.add(item)
  }
  let { courseList } = props
  return (
    <div className="box">
      {courseList.map((v) => {
        return (
          <div className="item" key={v.id}>
            <h1>{v.title}</h1>
            <p>{v.content}</p>
            <button onClick={() => add(v)}>加入购物车</button>
          </div>
        )
      })}
    </div>
  )
}
